(function () {
    axios.get('http://127.0.0.1:9094/xiNan', {}).then((response) => {
        var xData=[2015,2016,2017,2018,2019,2020,2021];
        var yData1=[];
        var yData2=[];
        yData1 = Object.values(response.data[0])
        yData2 = Object.values(response.data[1])
        var myChart = echarts.init(document.getElementById('xinan'))
        option = {
            tooltip: {
                trigger: 'axis',
                axisPointer: {
                    type: 'shadow'
                }
            },
            grid: {
                left: '3%',
                right: '4%',
                bottom: '3%',
                containLabel: true,
                height: '90%',
                width: '90%'
            },
            xAxis: [
                {
                    type: 'category',
                    data: xData,
                    axisTick: {
                        alignWithLabel: true
                    },
                    axisLine:{
                        lineStyle:{
                            color: '#fff'
                        }
                    },
                    axisLabel: {
                        interval: 0, //隔多少点显示一个X轴刻度,0就是全部显示
                    }
                }
            ],
            // dataZoom:{
            //     type: 'slider',
            //     show: true
            // },
            yAxis: [
                {
                    type: 'value',
                    axisLine:{
                        lineStyle:{
                            color: '#fff'
                        }
                    }
                }
            ],
            series: [
                {
                    name: '城市',
                    type: 'bar',
                    barWidth: '30%',
                    data: yData1,
                    color:'#00FA9A',
                },
                {
                    name: '农村',
                    type: 'bar',
                    barWidth: '30%',
                    data: yData2,
                    color:'#0EE0FD',
                }
            ]
        };
        myChart.setOption(option)
    })
})()
